<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Know Your Graph</title>
</head>
<body>

<div class="container-fluid" style="margin-left: -32px;">

  <div class="row">
    <%= render 'user_console/common/navbar' %>
  </div>

  <div class="row" style="margin-top: 18px;">
    <div class="col-sm-3 col-lg-2">
      <%= render 'user_console/common/sidebar' %>
    </div>

    <div class="col-sm-9 col-lg-10">
      <h1>Task Detail</h1>


      <h3><span style="color: darkgray;">Task ID:</span><br/>
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<%= @task._id %>
      </h3>

      <h3><span style="color: darkgray;">Brief:</span><br/>
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<%= @task.brief %>
      </h3>

      <h3><span style="color: darkgray;">Source File:</span><br/>
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        <% if @file_detail.nil? %>
            The file doesn't exist.
        <% else %>
            <a href="<%= "/user_console/graph_data_files/#{@file_detail._id}" %>"><%= @file_detail.file_name %></a>
        <% end %>
      </h3>

      <h3><span style="color: darkgray;">Task created at:</span><br/>
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<%= @task.created_at %></h3>

      <h3><span style="color: darkgray;">Task Parameters:</span></h3>
      <% @task.task_params.each_pair {|k, v| %>
          <h4>
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <%= "#{k}:  #{v}" %>
          </h4>
      <% } %>
      <h3><span style="color: darkgray;">Task State:</span><br/>
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<%= @task.task_state %></h3>

      <% if @task.task_state == 'Finished' %>

          <h3><span style="color: darkgray;">Outputs:</span></h3>

          <% @task.outputs.each_pair {|k, v| %>

              <h4>
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                <a href="/user_console/tasks/download_task_output/<%=v%>"><%= k %></a>
              </h4>

          <% } %>

      <% end %>


    </div>
  </div>
</div>
</body>
</html>